# React Bridge 概览

`@module-federation/bridge-react` 是一个强大的微前端解决方案，专为 React 应用设计。通过提供跨框架渲染和路由协同能力，您可以轻松地将 React 应用或模块作为独立应用进行导出和加载。

## 核心功能

### 基础能力
- **🚀 应用级模块导出**：使用 `createBridgeComponent` 将完整的 React 应用包装为可远程加载的模块
- **📦 应用级模块加载**：通过 `createRemoteAppComponent` 在宿主应用中无缝集成远程 React 应用
- **🎯 组件级懒加载**：支持 `createLazyComponent` 实现细粒度的组件级懒加载

### 特性
- **� 跨框架渲染**：支持不同框架（如 React、Vue、Angular 等）间的跨框架渲染
- **🛣️ 路由协同能力**：自动处理 React Router 的 basename 注入和路由上下文传递
- **🔗 版本兼容**：完全支持 React 16-19，自动处理不同版本间的渲染差异和生命周期
- **⚡ 数据预取**：内置资源数据预取机制，支持应用、组件和依赖的预取优化

### 为什么这很重要？

- **渐进式升级**：允许不同团队按自己的节奏升级 React 版本
- **零中断集成**：新老版本应用可以无缝协作，无需同步升级
- **技术债务管理**：避免因版本不一致导致的集成问题
- **团队自主性**：每个团队可以独立选择最适合的 React 版本

## 灵活的导入方式

React Bridge 提供了灵活的导入方式，用户可根据自己的 React 版本选择合适的实现：

```tsx
import { createBridgeComponent } from '@module-federation/bridge-react'; // React 16/17
import { createBridgeComponent } from '@module-federation/bridge-react/18'; // React 18
import { createBridgeComponent } from '@module-federation/bridge-react/19'; // React 19
```
### 💡 示例
[完整示例](https://github.com/module-federation/core/tree/main/apps/router-demo) - 包含多个 React 应用的完整微前端项目
